<template>
  <div class="footer-container">
    <!-- 底部帮助模块 -->
    <div class="mod-help w" v-show="isShow">
      <dl>
        <dt>购物指南</dt>
        <dd>购物流程</dd>
        <dd>会员介绍</dd>
        <dd>生活旅行/团购</dd>
        <dd>常见问题</dd>
        <dd>购物指南</dd>
      </dl>
      <dl>
        <dt>购物指南</dt>
        <dd>购物流程</dd>
        <dd>会员介绍</dd>
        <dd>生活旅行/团购</dd>
        <dd>常见问题</dd>
        <dd>购物指南</dd>
      </dl>
      <dl>
        <dt>配送方式</dt>
        <dd>上门自提</dd>
        <dd>神威速达</dd>
        <dd>配送服务查询</dd>
        <dd>配送费收取标准</dd>
        <dd>海外配送</dd>
      </dl>
      <dl>
        <dt>支付方式</dt>
        <dd>货到付款</dd>
        <dd>在线支付</dd>
        <dd>分期付款</dd>
        <dd>邮局汇款</dd>
        <dd>公司转账</dd>
      </dl>
      <dl>
        <dt>售后服务</dt>
        <dd>售后政策</dd>
        <dd>价格保护</dd>
        <dd>退款说明</dd>
        <dd>返修/退换货</dd>
        <dd>取消订单</dd>
      </dl>
      <dl>
        <dt>特色服务</dt>
        <dd>夺宝机</dd>
        <dd>DIY装机</dd>
        <dd>延保服务</dd>
        <dd>宇智波购E卡</dd>
        <dd>宇智波通信</dd>
      </dl>
      <dl>
        <dt>帮助中心</dt>
        <dd>二维码</dd>
      </dl>
    </div>
    <!-- 版权模块 -->
    <div class="mod-copy w">
      <ul>
        <li><router-link to="">关于我们</router-link></li>
        <li><router-link to="">联系我们</router-link></li>
        <li><router-link to="">关注我们</router-link></li>
        <li><router-link to="">商家入驻</router-link></li>
        <li><router-link to="">营销中心</router-link></li>
        <li><router-link to="">友情链接</router-link></li>
        <li><router-link to="">须佐能乎</router-link></li>
        <li><router-link to="">宇智波家族</router-link></li>
        <li><router-link to="">写轮眼</router-link></li>
        <li><router-link to="">轮回眼</router-link></li>
        <li><router-link to="">宇智波带土</router-link></li>
      </ul>
      <p>地址：忍者世界木叶村宇智波家族</p>
      <p>宇ICP备1231231好</p>
    </div>
  </div>
</template>

<script>
export default {
  name: 'Footer',
  props: {
    isShow: {
      type: Boolean,
      required: true,
      defalut: false
    }
  }
}
</script>

<style lang="less" scoped>
.footer-container {
  // height: 350px;
  padding: 20px 0;
  background-color: #eaeaea;
  .mod-help {
    display: flex;
    justify-content: space-between;
    height: 200px;
    margin-bottom: 20px;
    border-bottom: solid 1px #e3e3e3;
    dl {
      dt {
        font-weight: 900;
      }
      dd {
        margin-top: 5px;
        font-size: 12px;
        color: #2e2e3e;
      }
    }
  }
  .mod-copy {
    display: flex;
    flex-direction: column;
    align-items: center;
    // margin-top: 20px;
    ul {
      display: flex;
      justify-content: center;
      li {
        &:last-child {
          a {
            border: 0;
          }
        }
        a {
          padding: 0 10px;
          font-size: 12px;
          color: #2e2e3e;
          border-right: solid 1px #696969;
        }
      }
    }
    p {
      margin-top: 10px;
      font-size: 12px;
      color: #2e2e3e;
    }
  }
}
</style>
